import { Demo1Component } from './demo1/demo1.component';
import { Demo2Component } from './demo2/demo2.component';
import { DynamicComponent } from './dynamic/dynamic.component';
import { CustomizeComponent } from './customize/customize.component';
import { Demo5Component } from './demo5/demo5.component';
import { Demo6Component } from './demo6/demo6.component';

export const ProgressConfig = {
  location: 'Progress',
  description: '为用户的操作提供实时的进度反馈。',
  description_en: 'Provide real-time progress feedback for user actions.',
  component: [
    {
      demo: Demo1Component,
      codePath: 'showcase/progress/demo1/demo1.component',
      demoTitle: '条形进度',
      demoTitle_en: 'Line Progress',
      demoDescription: '标准的进度条，可根据使用场景自定义每个进度的颜色。',
      demoDescription_en: 'The progress of the bar, you can customize the color of each progress according to the usage scene.',
    },
    {
      demo: Demo6Component,
      codePath: 'showcase/progress/demo6/demo6.component',
      demoTitle: '条形虚线进度',
      demoTitle_en: 'Line Progress',
      demoDescription: '标准的进度条，可根据使用场景自定义每个进度的颜色。',
      demoDescription_en: 'The progress of the bar, you can customize the color of each progress according to the usage scene.',
    },
    {
      demo: Demo2Component,
      codePath: 'showcase/progress/demo2/demo2.component',
      demoTitle: '环形进度',
      demoTitle_en: 'Circle Progress.',
      demoDescription: '环形的进度，可根据使用场景自定义每个进度的颜色。',
      demoDescription_en: 'The progress of the ring, you can customize the color of each progress according to the usage scenario.',
      devDebug: true,
    },
    {
      demo: DynamicComponent,
      codePath: 'showcase/progress/dynamic/dynamic.component',
      demoTitle: '动态效果',
      demoTitle_en: 'Dynamic Effect',
      demoDescription: '进度动态效果展示。',
      demoDescription_en: 'Progress dynamic performance display.',
    },
    {
      demo: CustomizeComponent,
      codePath: 'showcase/progress/customize/customize.component',
      demoTitle: '自定义',
      demoTitle_en: 'Customize',
      demoDescription: '可自定义 label 标签的显示内容。注：条形进度 lvInnerLabel 为 true 时，自定义无效。',
      demoDescription_en:
        'Customizable label label display content. Note: When the bar progress lvInnerLabel is true, the customization is invalid.',
    },
    {
      demo: Demo5Component,
      codePath: 'showcase/progress/demo5/demo5.component',
      demoTitle: '扩展内容',
      demoTitle_en: 'Extended content',
      demoDescription: '扩展进度条内容。',
      demoDescription_en: 'Expand progress bar content.',
    },
  ],
  useRule: [],
  useSuggestion: [],
  selector: 'lv-progress',
  snippet: `<lv-progress [lvValue]="\${1:80}"></lv-progress>`,
  api: [
    {
      attribute: 'lvType',
      type: 'string',
      default: 'line',
      description: `进度类型 ('line' | 'dashed')。`,
      description_en: `Schedule type ('line' | 'dashed').`,
    },
    {
      attribute: 'lvValue',
      type: 'number',
      default: '0',
      description: `进度的百分比值，范围 0~100。`,
      description_en: `Percentage of progress, range 0~100.`,
    },
    {
      attribute: 'lvWidth',
      type: 'number',
      default: 'null',
      description: `视图宽度，当值为 null 时，条形进度默认为宽度自适应，环形进度默认宽度为 200px。`,
      description_en: `View width, when the value is null, the bar progress defaults to width adaptive, and the circular progress default width is 200px.`,
    },
    {
      attribute: 'lvSize',
      type: 'string',
      default: 'default',
      description: `进度的大小 ('small' | 'default')。`,
      description_en: `The size of the progress ('small' | 'default').`,
    },
    {
      attribute: 'lvStatus',
      type: 'string',
      default: 'normal',
      description: `进度的状态 ('normal' | 'active' | 'error' | 'success')。`,
      description_en: `Status of progress ('normal' | 'active' | 'error' | 'success').`,
    },
    {
      attribute: 'lvLabel',
      type: 'string | TemplateRef',
      default: 'null',
      description: `自定义 label 标签显示的内容，支持字符串或 template 模板。注：'line' 形进度 lvInnerLabel 为 true 时，自定义无效。`,
      description_en: `Customize the content displayed by the label, supporting strings or template templates. Note: When 'line' shape progress lvInnerLabel is true, the customization is invalid.`,
    },
    {
      attribute: 'lvShowLabel',
      type: 'boolean',
      default: 'true',
      description: `是否显示 label 标签。`,
      description_en: `Whether to display the label tag.`,
    },
    {
      attribute: 'lvInnerLabel',
      type: 'boolean',
      default: 'true',
      description: `label 标签是否显示在进度条内部。注：该属性只在 'line' 形进度有效。`,
      description_en: `Whether the label tag is displayed inside the progress bar. Note: This attribute is only valid in the 'line' shape.`,
    },
    {
      attribute: 'lvColors',
      type: 'array<value:number, color:string>',
      default: '[]',
      description: `自定义进度颜色，设置大于某个进度时刻的颜色值，如: [[0, 'red'], [50, 'blue'], [100, 'green']]。`,
      description_en: `Customize the progress color and set the color value greater than a certain progress time, such as: [[0, 'red'], [50, 'blue'], [100, 'green']]。`,
    },
    {
      attribute: 'lvExtra',
      type: 'TemplateRef<{ $implicit: any }>',
      default: '',
      description: `扩展进度条内容。`,
      description_en: `Expand progress bar content.`,
    },
    {
      attribute: 'lvDecimals',
      type: 'number',
      default: 'null',
      description: `保留小数位数。`,
      description_en: `Keep decimal places.`,
    },
    {
      attribute: 'lvMethod',
      type: 'string',
      default: 'round',
      description: `保留小数的方式。可选值为（'round' | 'floor' | 'ceil'）`,
      description_en: `The way to keep decimals. Optional values ​​are ('round' |'floor' |'ceil').`,
    },
    {
      attribute: 'lvLabelPosition',
      type: 'string',
      default: 'right',
      description: `label的显示位置。可选值为（'right' | 'top'）`,
      description_en: `Display position of the label. The options are ('right' |'top')`,
    },
  ],
  event: [],
};
